<style lang="less" scoped>
.hot_wrap {
  padding: 0 0.28rem; background-color: #fff;
  .tit {height: 0.7rem; line-height: 0.7rem; overflow: hidden; border-bottom: 1px solid #d3d3d3; font-size: 0.28rem;}
  .tit h3 {float: left;}
  .tit span {float: right; color:#999;}
  .items {overflow: hidden; padding-top: 0.28rem;}
  .items li {float: left; max-width: 8em; margin: 0 0.28rem 0.28rem 0; border-radius: 3px; overflow: hidden; padding: 0.08rem 0.16rem; box-sizing: border-box;  border: 1px solid #d3d3d3;}
}
</style>

<template>
  <div class="search_page_wrap">
    <SearchItem ins="search"></SearchItem>
    <!--  -->
    <div class="hot_wrap" style="margin-top:1px;">
      <div class="tit">
        <h3>热门搜索</h3>
      </div>
      <ul class="items">
        <li>宝石</li>
        <li>钻石</li>
        <li>红猛犸</li>
        <li>净宗商店</li>
        <li>宝石</li>
        <li>钻石</li>
        <li>红猛犸</li>
        <li>净宗商店</li>
      </ul>
    </div>
    <!--  -->
    <div class="hot_wrap" style="margin-top:0.14rem;">
      <div class="tit">
        <h3>历史搜索</h3>
        <span><yd-icon name="delete" size="0.28rem" style="margin-right: 0.3em;"></yd-icon>清除历史记录</span>
      </div>
      <ul class="items">
        <li>宝石</li>
        <li>钻石</li>
        <li>红猛犸</li>
        <li>净宗商店</li>
        <li>宝石</li>
        <li>钻石</li>
        <li>红猛犸</li>
        <li>净宗商店</li>
      </ul>
    </div>
  </div>
</template>
<script>
import SearchItem from '../Common/SearchItem'
export default {
  components: { SearchItem },
  data() {
      return {

      }
  }
}
</script>
